import { BasicColumn } from '/@/components/Table';
import { FormSchema } from '/@/components/Table';
import { bindMapFormSchema } from '/@/utils/common/compUtils';
import { list as deviceTypeList } from '../deviceType/deviceType.api';
import { getDeviceModelByType } from '../deviceModel/deviceModel.api';
import { listByModel } from '../device/device.api';
import { listDeviceChildByUid } from '../deviceChild/deviceChild.api';
import { getPointGroupByModelId } from '../pointGroup/pointGroup.api';
import { getCollectActions, getStoreActions } from '../collectTask/collectTask.api';

import { rules } from '/@/utils/helper/validator';
import { render } from '/@/utils/common/renderUtils';
import { buildUUID } from '/@/utils/uuid';

export const columns: BasicColumn[] = [
  {
    title: '采集设备',
    dataIndex: 'deviceName',
    width: 120,
  },
  {
    title: '设备编号',
    dataIndex: 'deviceSn',
    width: 100,
  },
  {
    title: '子设备',
    dataIndex: 'childName',
    width: 120,
  },
  {
    title: '子设备编号',
    dataIndex: 'childSn',
    width: 80,
  },
  {
    title: '点位组',
    dataIndex: 'pointGroupName',
    width: 80,
  },
  {
    title: '采集动作',
    dataIndex: 'collectAction',
    width: 80,
  },
  {
    title: '存储动作',
    dataIndex: 'storeAction',
    width: 80,
  },
];

export const searchFormSchema: FormSchema[] = [
  {
    label: '设备编号',
    field: 'deviceSn',
    component: 'Input',
    colProps: { span: 6 },
  },
  {
    label: '设备名称',
    field: 'deviceName',
    component: 'Input',
    colProps: { span: 6 },
  },
];


const mapFormSchema = bindMapFormSchema(
  {
    col_span_one: {
      colProps: {
        xs: 24,
        sm: 12,
      },
      itemProps: {
        labelCol: { xs: 24, sm: 5 },
        wrapperCol: { xs: 24, sm: 18 },
        colon: true,
      },
      style: { width: '100%' },
    },
    col_span_two: {
      colProps: {
        xs: 24,
        sm: 24,
      },
      itemProps: {
        labelCol: { xs: 18, sm: 3 },
        wrapperCol: { xs: 24, sm: 20 },
        colon: true,
      },
      style: { width: '100%' },
    },
  },
  'col_span_one'
);


export const formSchema: FormSchema[] = [
  {
    label: '',
    field: 'id',
    component: 'Input',
    show: false,
  },
  mapFormSchema(
    {
      label: '设备类型',
      field: 'deviceTypeId',
      component: 'ApiTreeSelect',
      componentProps: ({ formModel }) => {
        return {
          api: deviceTypeList,
          immediate: true,
          expandAll: true,
          resultField: 'data',
          fieldNames: {
            label: 'name',
            key: 'id',
            value: 'id',
          },
          dropdownStyle: {
            maxHeight: '50vh',
          },
          getPopupContainer: () => document.body,
          onChange: (v,item) => {
            // formModel.modelId = '';
            // formModel.uid = '';
            // formModel.childSn = '';
            // formModel.childDeviceId = '';
            // formModel.pointGroupId = '';
          }
        };
      },
    },
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '设备型号',
      field: 'modelId',
      component: 'ApiSelect',
      required: true,
      componentProps: ({ formModel }) => {
        return {
          api: getDeviceModelByType,
          params: {typeId: formModel.deviceTypeId},
          labelField: 'model',
          valueField: 'id',
          getPopupContainer: () => document.body,
          onChange: (v,item) => {
            // formModel.uid = '';
            // formModel.childSn = '';
            // formModel.childDeviceId = '';
          }
        };
      },
    },
    'col_span_one'
  ),  
  mapFormSchema(
    {
      label: '采集设备',
      field: 'uid',
      component: 'ApiSelect',
      required: true,
      componentProps: ({ formModel }) => {
        return {
          api: listByModel,
          params: {modelId: formModel.modelId},
          labelField: 'name',
          valueField: 'uid',
          getPopupContainer: () => document.body,
          onChange: (v,item) => {
            // formModel.childSn = '';
            // formModel.childDeviceId = '';
          }
        };
      },
    },
    'col_span_one'
  ),  
  {
    label: '',
    field: 'childDeviceId',
    component: 'Input',
    show: false,
  },
  mapFormSchema(
    {
      label: '子设备',
      field: 'childSn',
      component: 'ApiSelect',
      componentProps: ({ formModel }) => {
        return {
          api: listDeviceChildByUid,
          params: {uid: formModel.uid},
          labelField: 'name',
          valueField: 'childSn',
          getPopupContainer: () => document.body,
          onChange: (v,item) => {
            formModel.childDeviceId = item['id'];
          }
        };
      },
    },  
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '点位组',
      field: 'pointGroupId',
      component: 'ApiSelect',
      required: true,
      componentProps: ({ formModel }) => {
        return {
          api: getPointGroupByModelId,
          params: {modelId: formModel.modelId},
          labelField: 'name',
          valueField: 'id',
          getPopupContainer: () => document.body,
        };
      },
    },  
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '采集动作',
      field: 'collectAction',
      component: 'ApiSelect',
      required: true,
      componentProps: ({ formModel }) => {
        return {
          api: getCollectActions,
          labelField: 'label',
          valueField: 'value',
          getPopupContainer: () => document.body,
        };
      },
    }, 
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '存储动作',
      field: 'storeAction',
      component: 'ApiSelect',
      required: true,
      componentProps: ({ formModel }) => {
        return {
          api: getStoreActions,
          labelField: 'label',
          valueField: 'value',
          getPopupContainer: () => document.body,
        };
      },
    }, 
    'col_span_one'
  ),
  mapFormSchema(
    {
      label: '存储配置',
      field: 'extend',
      component: 'InputTextArea',
    },
    'col_span_one'
  ),
];